<% content_for :javascript_link_tags do %>
<%= javascript_include_tag ['/assets/moment.min.js',
                            '/assets/backbone.paginator.js',
                            '/assets/admin/models/item.js',
                            '/assets/admin/collections/paginated_collection.js',
                            '/assets/admin/views/result_view.js',
                            '/assets/admin/views/pagination_view.js',
                            '/assets/admin/views/list_view.js',
                            '/assets/admin/views/notification_view.js',
                            '/assets/admin/controllers/notifications/search_controller.js',
]
%>
<% end %>

<% content_for :stylesheet_link_tags do %>
<%= stylesheet_link_tag ['/assets/smoothness/jquery-ui-1.8.23.custom.css',
                         '/assets/jquery-ui-timepicker-addon.css'
] %>
<% end %>
<span id="system_message" style="visibility: hidden"><%= @message %></span>
  <div class="span9">
    <div class="control-group">
      <legend>お知らせ検索</legend>
    </div>
    <form class="well form-query">
      <div class="control-group">
        <div class="controls">
          <label class="radio">
            <input type="radio" name="distribution" id="option_user_all" value="all" placeholder="" checked>全ユーザー
          </label>
        </div>

        <div class="controls" >
          <label class="radio">
            <input type="radio" name="distribution" id="option_users" value="any" placeholder="" >指定ユーザー
          </label>
            <div class="controls">
                <div class="controls form-search" id="control_option_users">
                  <input type="text" name="user_id" value="" >
                </div>
            </div>
          </label>
        </div>
      </div>

      <div class="control-group">
        <div class="controls">
          <label class="control-label">掲載期間</label>
          <span class="input-prepend">
            <input type="text" id="display_begin_at" name="display_begin_at" value="" placeholder="">
            <span class="add-on" id="icon_display_begin_at"><i class="icon-calendar"></i></span>
          </span>
          <span style="margin:10px;">~</span><span class="input-prepend">
            <input type="text" id="display_end_at" name="display_end_at" value="" placeholder="">
            <span class="add-on" id="icon_display_end_at"><i class="icon-calendar"></i></span>
          </span>
        </div>
      </div>
      <div class="controls" style="text-align:right">
        <button type="submit" class="btn">検索</button>
      </div>
    </form>

    <div class="controls">
      <legend>検索結果</legend>
    </div>

    <div id="pagination"></div>
    <table id="notification-list" class="table table-striped table-bordered">
      <thead>
        <tr>
          <th>タイトル</th>
          <th>掲載期間</th>
          <th>対象</th>
          <th></th>
        </tr>
      </thead>
      <!--  The content is mapped on #resultItemTemplate -->
      <tbody id="content"></tbody>
    </table>
    <!--  The pagination is mapped on #tmpServerPagination -->


    <script type="text/template" id="resultItemTemplate">
      <td><a href="/notifications/n-{{ uuid }}">{{ title }}</a></td>
      {% if(display_begin_at != '' && display_end_at != ''){ %}
      <td>{{  app.helpers.date_ja.parse(display_begin_at) }} ~ {{  app.helpers.date_ja.parse(display_end_at) }}</td>
      {% } else {%}
      <td></td>
      {% } %}
      {% if(distribution == 'all') { %}
      <td>全ユーザー</td>
      {% } else if(distribution == 'any') { %}
      <td>指定ユーザー</td>
      {% } else {%}
      <td></td>
      {% } %}
      <td>
      {% if(!_.isEmpty(title)) { %}
      <button class="btn delete">削除</button>
      {% } %}
      </td>
    </script>
      <div class="modal hide" role="dialog" id="destroyNotification">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">×</button>
          <h3>お知らせ削除</h3>
        </div>
        <div class="modal-body">
          <p>お知らせを削除します。よろしいですか？</p>
        </div>
        <div class="modal-footer">
          <button class="btn" data-dismiss="modal">キャンセル</button>
          <button class="btn btn-primary actionDestroy" data-dismiss="modal">削除</button>
        </div>
      </div>
      <%= partial :paginate %>
    </div>
